<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <!--  引入本地的layui.css样式文件  -->
    <link rel="stylesheet" href="../../layui/css/layui.css">
</head>
<body>

<form class="layui-form" action="" style="margin: 20px;">
    <div class="layui-form-item">
        <label class="layui-form-label">课程名称</label>
        <div class="layui-input-block">
            <input type="text" name="courseName" lay-verify="required|courseName" autocomplete="off" placeholder="请填写课程名称" class="layui-input">
        </div>
    </div>
<!--    <div class="layui-form-item">-->
<!--        <label class="layui-form-label">课程类型</label>-->
<!--        <div class="layui-input-block">-->
<!--            <input type="password" name="courseType" lay-verify="required|password" autocomplete="off" placeholder="请填写课程类型" class="layui-input">-->
<!--        </div>-->
<!--    </div>-->
    <div class="layui-form-item">
        <label class="layui-form-label">课程类型</label>
        <div class="layui-input-inline">
            <select name="courseType">
                <option value="">请选择</option>
                <option value="公共必修课">公共必修课</option>
                <option value="专业必修课">专业必修课</option>
                <option value="通识选修课">通识选修课</option>
                <option value="专业选修课">专业选修课</option>
                <option value="社会实践课">社会实践课</option>
            </select>
        </div>
    </div>
    <div class="layui-form-item">
        <label class="layui-form-label">任课老师</label>
        <div class="layui-input-block">
            <input type="text" name="courseTeacher" autocomplete="off" placeholder="请填写任课教师" class="layui-input">
        </div>
    </div>
    <div class="layui-form-item">
        <label class="layui-form-label">上课地点</label>
        <div class="layui-input-block">
            <input type="text" name="place" autocomplete="off" placeholder="请填写上课地点" class="layui-input">
        </div>
    </div>
    <div class="layui-form-item">
        <label class="layui-form-label">学分</label>
        <div class="layui-input-block">
            <input type="text" name="credit" autocomplete="off" placeholder="请填写学分" class="layui-input">
        </div>
    </div>
    <div class="layui-form-item layui-hide">

            <button type="submit" class="layui-btn" lay-submit lay-filter="LAY-user-front-submit" id="LAY-user-front-submit">确认</button>

    </div>
</form>



<!--  引入本地的layui.js文件  -->
<script type="text/javascript" src=../../layui/layui.js></script>
<script type="text/javascript">
    layui.use(['form', 'layedit', 'layer','laydate'], function(){
        var $ = layui.$,
            form = layui.form,
            layedit = layui.layedit,
            laydate = layui.laydate,
            layer = layui.layer;

        //常规用法
        laydate.render({
            elem: '#entry_date'
        });

        //创建一个编辑器
        var editIndex = layedit.build('LAY_demo_editor');

        //自定义验证规则
        form.verify({
            courseName: function(value){
                if(value.length < 3){
                    return '课程名称至少得3个字符啊';
                }
            }
            ,content: function(value){
                layedit.sync(editIndex);
            }
        });

        //监听提交
        form.on('submit(btn_submit)', function(data){
            layer.alert(JSON.stringify(data.field), {
                title: '最终的提交信息'
            })

            return false;
        });


    });
</script>

</body>
</html>